<template>
  <div class="mul-routers">
      <div class="routes-page">
        <RouterLink class="router-link-style" active-class="active"  to="/mulRoutes/main">主页</RouterLink>
        <RouterLink class="router-link-style" active-class="active" to="/mulRoutes/content">内容</RouterLink>
        <RouterLink class="router-link-style" active-class="active" to="/mulRoutes/personal">我的</RouterLink>
      </div>
      <RouterView />
  </div>
</template>
<script setup lang="ts" name="MulRouters">
import { RouterLink } from 'vue-router'


</script>
<style  scoped>
.routes-page{
  display:flex;
  justify-content: space-evenly;
}
.router-link-style{
  height: 50px;
  width: 130px;
  background: #dede;
  display: flex;
  justify-content: center;
  align-items: center;
}
.active{
  color: pink;
}
</style>
